<template>
  <div class="side-right">
    <!--
    <client-only>
      <el-popover placement="left">
        <template #reference>
          <img class="cursor" src="~/assets/svg/gzh.svg" alt="" />
        </template>
        <template #default>
          <img style="width: 126px" src="~/assets/image/gzh.jpg" alt="微信公众号" />
          <div style="font-size: 10px; text-align: center">扫码关注微信公众号</div>
        </template>
      </el-popover>
    </client-only>
    <el-divider />
    -->
    <!-- 置顶 -->
    <img class="cursor" src="~/assets/svg/top.svg" @click="handleTop" alt="" />
  </div>
</template>
<script setup>
  // 置顶
  const handleTop = () => {
    // 滚动到顶部
    document.querySelector('.el-main').scrollTo({
      top: 0,
      behavior: 'smooth'
    })
  }
</script>
<style lang="scss" scoped>
  .side-right {
    position: fixed;
    background-color: #fff;
    right: 20px;
    top: 40vh;
    border-radius: 15px;
    padding: 8px;
    .cursor {
      padding: 5px;
      &:hover {
        background-color: #eee;
      }
    }
  }
  img {
    width: 25px;
  }
</style>
